<template>
    <el-dialog :model-value="dialogFormVisible" title="编辑" align-center
    draggable width="33%"
    style="border-radius: 10px; padding: 5px 10px">
        <el-form :model="form" label-width="120px" :rules="rules">
            <el-form-item label="员工姓名">
                {{form.empName}}
            </el-form-item>
            <el-form-item label="基础工资">
                <el-input v-model="form.wage" style="width: 250px"/>
            </el-form-item>
            <el-form-item label="地区系数">
                <el-select v-model="form.regionCoefficientId" placeholder="请选择" style="width: 250px">
                    <el-option v-for="(item,index) in regionList" :label="item.region" :key="index" :value="item.id"/>
                </el-select>
            </el-form-item>
            <el-form-item label="岗位系数">
                <el-input v-model="form.positionCoefficient" style="width: 250px"/>
            </el-form-item>
            <el-form-item label="绩效工资">
                <el-input v-model="form.performanceWage" style="width: 250px"/>
            </el-form-item>
            <el-form-item>
                <el-button style="width: 100px" type="primary" @click="onSubmit">确定</el-button>
                <el-button style="width: 100px" @click="onClose">取消</el-button>
                
            </el-form-item>
        </el-form>
    </el-dialog>
</template>
<script setup>
import {ref,onBeforeMount, reactive,defineProps, defineEmits,watch} from "vue";
import {getRegionCoefficient,updateEmpCoefficient} from "@/api/coefficient"
import { ElMessage } from 'element-plus'

const props = defineProps({
  dialogFormVisible: {
    type: Boolean,
    required: true
  },
  form:{
    type: Object,
    default: () => {}
  },
  close: {
    type: Function,
    default: () => {},
  },
  update: {
    type: Function,
    default: () => {},
  },
})

const dialogFormVisible = ref(false)
const regionList=ref([])   
const PositonCoefficientList=ref([]) 
const form = ref(/*{
empId: "",
empName: "",
id: "",
performanceWage: "",
positionCoefficient: "",
regionCoefficient:"",
regionCoefficientId:"",
state:"",
wage:""
}*/)
onBeforeMount(()=>{
    getRegionCoefficient().then(data=>{
        regionList.value=[]
        for (let i of data.data) {
            i.id=String(i.id)
            regionList.value.push(i);
        }
    })
})

watch(props, (newValue, oldValue) => {
      form.value=props.form
      form.value.createTime=""
      form.value.updateTime=""
      /*form.value.empId=props.form.empId
      form.value.empName=props.form.empName*/
    });

const onClose = () => {
  props.close()
}

const onSubmit=()=>{
    updateEmpCoefficient(form.value).then(data=>{
        if(data.code==200){
        ElMessage({
            message: '修改成功',
            type: 'success',
        })
        props.update()
        props.close()
        }
    })
}
</script>
<style lang="scss" scoped >
::v-deep .el-form-item__label:before {
  content: "* ";
  color: red;
}
.ins {
  ::v-deep .el-form-item__label:before {
    content: " ";
  }
}
</style>